<!DOCTYPE html>
<html>
	<body>
		<head>
			<meta charset="utf-8" />
			<title>使用js读取html文件</title>
		</head>
		<body>
			<!-- iframe 读取html方法失败 -->
			<!-- <iframe name="myFrame" src="file/readedFile.html"></iframe>
			<script type="text/javascript">
				var htmlText = window.frames['myFrame'].document.getElementsByTagName("body")[0].innerHTML;
				// var htmlText = window.frames['myFrame'].contentWindow.document.body.innerHTML;
				console.log(htmlText)
				
			</script> -->
			<div id="myDiv"></div>
			<div id="myDiv1"></div>
			<div id="myDiv2"></div>
			<div id="myDiv3"></div>
			<div id="myDiv4"></div>
			<script type="text/javascript">
				
				/* 重点： 这种方式读取的文件是读取的服务上的文件，HBuilder会将项目目录里的所有文件都置于模拟服务器端 */
				var xmlhttp;
				if (window.XMLHttpRequest) { // 兼容 IE7+, Firefox, Chrome, Opera, Safari
					xmlhttp = new XMLHttpRequest();
					console.log("XMLHttpRequest对象存在")
				}
				else { // 兼容IE6, IE5
					xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
				}
				xmlhttp.onreadystatechange = function() {
					if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
						document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
						document.getElementById("myDiv1").innerHTML = xmlhttp.responseBody;
						document.getElementById("myDiv2").innerHTML = xmlhttp.responseText;
						document.getElementById("myDiv3").innerHTML = xmlhttp.responseText;
						document.getElementById("myDiv4").innerHTML = xmlhttp.responseText;
					}
				}
				xmlhttp.open("GET", "file/readedFile.txt", true);
				xmlhttp.send();
			</script>
		</body>
	</body>
</html>